<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--作业：搞一个文本框，用户输入小写字母，然后同步将它转换为大写字母,放在一个h1标签里
    文本框事件：
    change:改变完，失去焦点才触发;
    oninput:输入就触发
    a:97    A:65
    'a'.charCodeAt(0)
    String.fromCharCode(97-32)


    1、String.fromCharCode()将一个编码转换为字符串
    'a'.charCodeAt(0) 将字符串中的索引未知的字符转换成编码
    'a'.toUpperCase() 将字符串转大写
    'A'.toLowererCase() 将字符串转小写

   2、var str="dfdfda"
    str.concat("dddd")字符串拼接

    3、str.endWith(".png")判断字符串是否以***结尾
       str.startWith(".png")判断字符串是否以***开始

    4、str.indexOf('tem') 查找子字符串在字符串中的位置
       str.substring(5,10) 截取一段字符串，包括第5个但不包括第10个字符

    5、str.split("")  将一个字符串切割为一个字符串数组

    6、str.replace(被替换的字符，要替换的新字符) 将字符串进行替换
        str.search(查找的条件) 在字符串中进行查找

    7、str.trim()  去掉前后空格


    数组
    1、ar.push(67)/ar[ar.length]=67;  在数组最后插入67
       ar.unshift(4);  在数组最前面插入4
    2、队列、栈
    作业：将以下的文本转置 "this is my info"----"ofni ym si siht"
    ar.pop() 从数组的后面弹出
    ar.push() 从数组后面加入  组合起来就是一个栈

    var str="this is my info"
    var ar=[];
    for(var i=0;i<str.length;i++){
        ar.push(str[i]);
    }
    for(var i=0;i<str.length;i++){
        ar.pop(str[i]);
    }
    队列的功能
    ar.push(str[0])
    ar.push(str[1])
    ar.push(str[2])
    ar.shift() 这就实现了队列的功能

    3、高阶函数-->
    <!--var users = [
        {name: "张三", age: 23, sex: '男', zodiac: ''},
        {name: "老王", age: 60, sex: '男', zodiac: ''},
        {name: "桂香", age: 19, sex: '女', zodiac: ''},
        {name: "魏红", age: 33, sex: '女', zodiac: ''},
        {name: "二狗", age: 5, sex: '男', zodiac: ''}
    ];

    //三个参数：当前的数组元素，当前数组元素的索引， 数组本身
    users.forEach(function(item,index,ar)){  将数组进行迭代，回调处理每一次迭代逻辑
        debugger;
    });

    var str=users.map(function(item,index,ar){}

    str=str.reduce(function(qian,dangqian,index,shuzu){}

     filter(item,index,ar),some(item,index,ar),every(item,index,ar)

    排序问题:sort()
    -->

</head>
<body>
<!--<input type="text" oninput="haha(this)">
<h1 id="alert"></h1>-->
<table id="tbl"></table>
<script>
    /*var h = document.getElementById('alert');

    function haha(a) {
        var code = a.charCodeAt(0);
        var daxie = String.fromCharCode(code - 32);
        h.innerHTML.value = daxie;
    }*/
    var users = [
        {name: "张三", age: 23, sex: '男', zodiac: ''},
        {name: "老王", age: 60, sex: '男', zodiac: ''},
        {name: "桂香", age: 19, sex: '女', zodiac: ''},
        {name: "魏红", age: 33, sex: '女', zodiac: ''},
        {name: "二狗", age: 5, sex: '男', zodiac: ''}
    ];
    //三个参数：当前的数组元素，当前数组元素的索引， 数组本身
    /*users.forEach(function(item,index,ar){  //将数组进行迭代---》回调处理每一次迭代逻辑
        debugger;
    });*/

    var str=users.map(function(item,index,ar){//将数组进行迭代，会创建一个新的数组
       return`
        <tr>
       <td>${item.name}</td>
       <td>${item.age}</td>
       <td>${item.sex}</td>
       </tr>`;
    });


    str=str.reduce(function(qian,dangqian,index,shuzu){
        /*debugger;*/
        return qian+dangqian;  //在下一轮迭代中return的值会赋值给qian
    });

    //console.log(str);

    var tbl=document.getElementById('tbl');
    tbl.innerHTML=str;


    var result=[1,2,3,4,5,6,7,8].filter(function(item,index,ar){
        if(item%2==0){
            return item;
            }
        });
        /*return item==3;*/
    console.log(result);


   /* 3、将以下数组50岁以上得人去掉，18岁以下的人去掉，
   显示出来表格,要求递减排序，如果年龄相等就把男性排在前面
   var users = [
        {name: "张三", age: 23, sex: '男', zodiac: ''},
        {name: "老王", age: 60, sex: '男', zodiac: ''},
        {name: "桂香", age: 19, sex: '女', zodiac: ''},
        {name: "魏红", age: 33, sex: '女', zodiac: ''},
        {name: "二狗", age: 5, sex: '男', zodiac: ''}
    ];*/

    /*链式调用：str.substring(3,6).toUpperCase().toLowerCase(),只有数组的可以这样*/

     var bb=[1,2,3,4,5,6,8].every(function(item,index,ar){
         return item>6;
     });
    var bb=[1,2,3,4,5,6,8].some(function(item,index,ar){
         return item>4;
     });

    var arr2=[];
    /*填充100个随机数,取值范围从12-97，整数*/
    for(var i=0;i<100;i++){
        arr2[i]=Math.floor(Math.random()*86)+19;  //random:0-1不包括1
    }
    /*arr2.sort(function(a,b){
    /!*如果a大，则返回正数，如果b大，则返回负数，如果a和b相等，则返回0*!/
       if(a>b){
           return 1;
       }else if(a<b){
           return -1;
       }
        return 0;
    });*/

    arr2.sort(function(a,b){/*如果a大，则返回正数，如果b大，则返回负数，如果a和b相等，则返回0*/
      /*return a-b;*/
        return b-a;
    });

     var users = [
        {name: "张三", age: 23, sex: '男', zodiac: ''},
        {name: "老王", age: 60, sex: '男', zodiac: ''},
        {name: "桂香", age: 23, sex: '女', zodiac: ''},
        {name: "魏红", age: 33, sex: '女', zodiac: ''},
        {name: "二狗", age: 5, sex: '男', zodiac: ''}
    ];
    users.sort(function(a,b){
        return a.age- b.age;
        /*if(b.age== a.age){
            if(a.sex='男') {
                return 1;
            }
            return -1;
        }*/

        var r= b.age- a.age;
        if(r==0){
            (b.sex.charCodeAt(0)-a.sex.charCodeAt(0));
        }
         return r;
    });
/*
* map:每一次回调函数返回的值组成新的数组，新数组长度和原数组长度一样
* filter：回调函数返回的是布尔值，true则保留，false则去掉，新数组与原数组长度不一样
* reduce：用来做统计，将每次回调的结果注入到第一个参数中
* forEach：普通的迭代
* */
    //4576
    var a=4576;
    var result=[100,50,20,10,5,1].map(function(item){
        var zhangshu=Math.floor(a/item);
        a-=zhangshu*item;
        return zhangshu;
    }).reduce(function(a,b){
        return a+b;
    })

    /*查表法：阿拉伯数字转大小写
            生肖
            4576块钱所需的张数
    */
</script>
</body>
</html>